<!DOCTYPE html>
<html lang="zxx">
<head>
    <title>FORT - 注册</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta charset="utf-8">

    <!-- External CSS libraries -->
    <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="css/animate.min.css">
    <link rel="stylesheet" type="text/css" href="css/bootstrap-submenu.css">

    <link rel="stylesheet" type="text/css" href="css/bootstrap-select.min.css">
    <link rel="stylesheet" type="text/css" href="css/magnific-popup.css">
    <link rel="stylesheet" href="css/leaflet.css" type="text/css">
    <link rel="stylesheet" href="css/map.css" type="text/css">
    <link rel="stylesheet" type="text/css" href="fonts/font-awesome/css/font-awesome.min.css">
    <link rel="stylesheet" type="text/css" href="fonts/flaticon/font/flaticon.css">
    <link rel="stylesheet" type="text/css" href="fonts/linearicons/style.css">
    <link rel="stylesheet" type="text/css" href="css/jquery.mCustomScrollbar.css">
    <link rel="stylesheet" type="text/css" href="css/dropzone.css">
    <link rel="stylesheet" type="text/css" href="css/slick.css">

    <!-- Custom stylesheet -->
    <link rel="stylesheet" type="text/css" href="css/style.css">
    <link rel="stylesheet" type="text/css" id="style_sheet" href="css/skins/default.css">

    <!-- Favicon icon -->
    <link rel="shortcut icon" href="img/favicon.ico" type="image/x-icon">



    <!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
    <link rel="stylesheet" type="text/css" href="css/ie10-viewport-bug-workaround.css">

    <!-- Just for debugging purposes. Don't actually copy these 2 lines! -->
    <!--[if lt IE 9]>
    <script src="js/ie8-responsive-file-warning.js"></script><![endif]-->
    <script src="js/ie-emulation-modes-warning.js"></script>

    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!--[if lt IE 9]>
    <script src="js/html5shiv.min.js"></script>
    <script src="js/respond.min.js"></script>
    <![endif]-->
    <script src="js/jquery-2.2.0.min.js"></script>
    <script src="js/popper.min.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script src="js/bootstrap-submenu.js"></script>
    <script src="js/rangeslider.js"></script>
    <script src="js/jquery.mb.YTPlayer.js"></script>
    <script src="js/bootstrap-select.min.js"></script>
    <script src="js/jquery.easing.1.3.js"></script>
    <script src="js/jquery.scrollUp.js"></script>
    <script src="js/jquery.mCustomScrollbar.concat.min.js"></script>
    <script src="js/leaflet.js"></script>
    <script src="js/leaflet-providers.js"></script>
    <script src="js/leaflet.markercluster.js"></script>
    <script src="js/dropzone.js"></script>
    <script src="js/slick.min.js"></script>
    <script src="js/jquery.filterizr.js"></script>
    <script src="js/jquery.magnific-popup.min.js"></script>
    <script src="js/jquery.countdown.js"></script>
    <script src="js/maps.js"></script>
    <!--<script  src="js/app.js"></script>-->

    <!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
    <script src="js/ie10-viewport-bug-workaround.js"></script>
    <!-- Custom javascript -->
    <script src="js/ie10-viewport-bug-workaround.js"></script>
</head>
<body class="bg-grea-3">
<!--<div class="page_loader"></div>-->

<!-- Contact section start -->
<div class="contact-section">
    <div class="container">
        <div class="row">
            <div class="col-lg-12">
                <!-- Form content box start -->
                <div class="form-content-box">
                    <!-- details -->
                    <div class="details">
                        <!-- Logo-->
                        <a href="/index">
                            <img src="img/black-logo.png" class="cm-logo" alt="black-logo">
                        </a>
                        <!-- Name -->
                        <h3>创建一个账户</h3>
                        <!-- Form start-->
                        <form id="user_register">
                            <span id="error" style="color: red"></span>
                            <div class="form-group row">
                                用户名:<input type="text" name="username" class="input-text" id="username">
                            </div>
                            <div class="form-group row">
                                密码:<input type="password" name="password" class="input-text" id="password">
                            </div>
                            <div class="form-group row">
                                确认密码:<input type="password" name="rePassword" class="input-text" id="rePassword">
                            </div>
                            <div class="form-group row">
                                手机号:<input type="text" name="mobile" class="input-text" id="mobile">
                            </div>
                            <div class="form-group row">
                                邮箱:<input type="email" name="email" class="input-text" id="email">
                            </div>
                            <div class="form-group row">
                                邮箱验证码:
                                <input type="text" name="code" class="input-text" id="code">
                            </div>
                            <div style="float:right;" class="form-group">
                                <button class="btn btn-primary" type="button" id="getCode">获取验证码</button>
                            </div>
                            <div class="form-group mb-0">
                                <button type="button" class="btn-md button-theme btn-block" id="register">提交</button>
                            </div>
                        </form>
                    </div>
                    <!-- Footer -->
                    <div class="footer">
                        <span>已经有账号? <a href="/login">点击这里登录</a></span>
                    </div>
                </div>
                <!-- Form content box end -->
            </div>
        </div>
    </div>
</div>
<!-- Contact section end -->
<script>

    var regMobile = /(13[0-9]|15[012356789]|17[678]|18[0-9]|14[57])[0-9]{8}$/;
    var regEmail = /^([a-z0-9_\.-]+)@([\da-z\.-]+)\.([a-z\.]{2,6})$/;

    //获取验证码
    $("#getCode").click(function () {
        var email = $("#email").val();
        if (email == '') {
            return document.getElementById("error").innerText = "请输入邮箱！！！";
        }
        $.ajax({
            url: "http://localhost:5761/lottery-system-system/system/api/email/sendCode",
            // url: "http://localhost:5730/system/api/email/sendCode",
            type: "GET",
            data: {
                email: email
            },
            success: function (result) {
                // console.log(result);
                if (result.code == 200) {
                    alert("已发送验证码，请查收；有效期为5分钟");
                } else {
                    alert("邮箱地址或格式错误，请重试");
                }
            }
        });
    });

    //点击提交
    $("#register").click(function () {
        var user = {
            username: $("#username").val(),
            password: $("#password").val(),
            rePassword: $("#rePassword").val(),
            mobile: $("#mobile").val(),
            email: $("#email").val(),
            code: $("#code").val()
        };
        if (user.username == '') {
            return document.getElementById("error").innerText = "请输入用户名！！！";
        }
        if (user.password == '') {
            return document.getElementById("error").innerText = "请输入密码！！！";
        }
        if (user.rePassword == '') {
            return document.getElementById("error").innerText = "请输入确认密码！！！";
        }
        if (user.password != user.rePassword) {
            return document.getElementById("error").innerText = "两次密码不一致！！！";
        }
        if (user.mobile == '') {
            return document.getElementById("error").innerText = "请输入手机号！！！";
        }
        if (!regMobile.test(user.mobile)) {
            return document.getElementById("error").innerText = "手机号码格式不正确！！！";
        }
        if (user.email == '') {
            return document.getElementById("error").innerText = "请输入邮箱！！！";
        }
        if (!regEmail.test(user.email)) {
            return document.getElementById("error").innerText = "邮箱格式不正确！！！";
        }
        if (user.code == '') {
            return document.getElementById("error").innerText = "请输入邮箱验证码！！！";
        }
        // console.log(user);
        $.ajax({
            url:"http://localhost:5761/lottery-system-user/user/api/user/register",
            // url: "http://localhost:5710/user/api/user/register",
            type: "POST",
            contentType: "application/json;charset=UTF-8",
            dataType: "JSON",
            data: JSON.stringify(user),
            success: function (result) {
                // console.log(result);
                if (result.code == 200) {
                    localStorage.setItem("token", result.data.token);
                    localStorage.setItem("userNo", result.data.userNo);
                    return window.location.href = "http://localhost/index";
                } else {
                    return alert("注册失败，"+result.message);
                }
            }
        });
    });

    //绑定Enter事件
    $(function () {
        $(document).keydown(function (event) {
            if (event.keyCode == 13) {
                $("#register").click();
            }
        });
    });

</script>

</body>
</html>